<template>
    <div>
        <a-form ref="formRef" @finish="handleFinish" :model="form" name="basic" :label-col="{ span: 8 }">
    
            <a-row :gutter="16">
                <a-col :span="12">
                    <a-form-item label="回款日期" name="receiveTime"  :rules="[{ required: true }]"> 
                        <!-- <a-input v-model:value="form.costcode" disabled style="width: 100%" placeholder="" /> -->
                        <a-date-picker :getCalendarContainer="trigger => trigger.parentNode" valueFormat="YYYY-MM-DD hh:mm:ss"  :disabled="isShow" v-model:value="form.receiveTime"
                            style="width: 100%" placeholder="" />

                    </a-form-item>
                </a-col>
                <a-col :span="12">
                    <a-form-item label="合同名称" name="contractName" :rules="[{ required: true }]"> 
                        <!-- <a-input v-model:value="form.contractName" disabled style="width: 100%" placeholder="" /> -->
                        <a-input-search :disabled="isShow" v-model:value="form.contractName" style="width: 100%" placeholder="选择的项目"
                         @click="onSearch"   @search="onSearch" />
                    </a-form-item>
                </a-col>
            </a-row>
            <a-row :gutter="16">
                <a-col :span="12">
                    <a-form-item label="项目名称" name="proName">
                        <a-input v-model:value="form.proName" disabled style="width: 100%" placeholder="" />
                    </a-form-item>
                </a-col>
                <a-col :span="12">
                    <a-form-item label="客户名称" name="partyA">
                        <a-input v-model:value="form.partyA" disabled style="width: 100%" placeholder="" />
                    </a-form-item>
                </a-col>
            </a-row>
            <a-row :gutter="16">
                <a-col :span="12">
                    <a-form-item label="回款方式" name="method"  :rules="[{ required: true }]"> 
                        <a-select :getPopupContainer="trigger => trigger.parentNode" ref="select" :disabled="isShow" v-model:value="form.method" :options="payType" style="width: 100%">
                     
                        </a-select>
           

                    </a-form-item>
                </a-col>
                <a-col :span="12">

                    <a-form-item label="回款类型" name="type"  :rules="[{ required: true }]"> 
                        <a-select :getPopupContainer="trigger => trigger.parentNode" ref="select" :disabled="isShow" v-model:value="form.type" :options="collectionType" style="width: 100%">
                      
                        </a-select>
                    </a-form-item>
                </a-col>
            </a-row>
            <a-row :gutter="16">
                <a-col :span="12">
                    <a-form-item label="回款金额" name="amount"  :rules="[{ required: true }]"> 
                        <a-input v-model:value="form.amount" :disabled="isShow" style="width: 100%" placeholder="" />
                    </a-form-item>
                </a-col>

            </a-row>
          
            <a-row :gutter="16" v-if="isShow">
                <a-col :span="12">
                    <a-form-item label="登记人" name="createUserName">
                        <a-input v-model:value="form.createUserName" disabled style="width: 100%" placeholder="" />
                    </a-form-item>
                </a-col>
                <a-col :span="12">
                    <a-form-item label="登记部门" name="orgName">
                        <a-input v-model:value="form.applicationDepartment" disabled style="width: 100%" placeholder="" />
                    </a-form-item>
                </a-col>
            </a-row>
            <a-row :gutter="16">
                <a-col :span="24">
                    <a-form-item :label-col="{ span: 4 }" :wrapper-col="{ span: 20 }" label="备注" name="remark">
                        <a-textarea v-model:value="form.remark"  :disabled="isShow" :rows="4" placeholder="" style="width: 100%" />
                    </a-form-item>
                </a-col>
            </a-row>
            <!-- isShow:{{ isShow }} -->
            <!-- <a-form-item  v-if="!isShow" :wrapper-col="{ span: 14, offset: 4 }">
                <a-button type="primary" html-type="submit">保存</a-button>
                <a-button style="margin-left: 10px" @click="onClose">取消</a-button>
            </a-form-item> -->
        </a-form>
        <contractSelection ref="contractSelect" @onClose="contractSelectOk" />
 
    </div>
</template>
<script setup>
import api from '@/api/finance/collection/index'
import { payType,collectionType } from '@/utils/constants.js'
import contractSelection from '@/components/pm/contractSelection.vue'






const form = ref({})
const formRef = ref()
const props = defineProps({
    isShow: {
        type: Boolean,
    }
})

const contractSelect = ref()
const onSearch = () => {
    contractSelect.value.show()
}
const contractSelectOk = (selectedRowKeys, selectRecords) => {
    form.value.contractId = selectRecords[0].id
    form.value.contractName = selectRecords[0].name
    form.value.proId = selectRecords[0].proId
    form.value.proName = selectRecords[0].proName
    form.value.partyA = selectRecords[0].partyA

}
const submit = () => {
    formRef.value.validate().then(() => {
        handleFinish(form.value)
    }).catch((err) => {

    });
}
const handleFinish = (values) => {

    console.log("handleFinish", values);
    if (!form.value.id) {
        api.add(values).then(() => {
            onClose(true);
        })
    } else {
        values.id = form.value.id;
        api.edit(values).then(() => {
            onClose(true);
        })
    }
};
const isEdit = ref(false)
const show = (record) => {
    if (record) {
        form.value = { ...record }
        isEdit.value = true;
    } else {
        form.value ={}
        isEdit.value = false
    }
}

defineExpose({
    submit,
    show,
    isEdit
})

const emits = defineEmits(['OnClose'])
const onClose = (refresh) => {
    emits('OnClose', refresh)
};
 
</script>